<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<h:html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<h:head>
	<title>whiteit - the frontpage of the hsr</title>
	<link rel="stylesheet" type="text/css" href="/WhiteIt/css/Layout.css" />
	<link href='http://fonts.googleapis.com/css?family=Average+Sans'
		rel='stylesheet' type='text/css'></link>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
	<script type="text/javascript"
		src="http://www.primefaces.org/showcase/javax.faces.resource/jquery/jquery.js.jsf?ln=primefaces&amp;v=4.0"></script>
	<script type="text/javascript"
		src="http://www.primefaces.org/showcase/javax.faces.resource/jquery/jquery-plugins.js.jsf?ln=primefaces&amp;v=4.0" />
	<script type="text/javascript"
		src="http://www.primefaces.org/showcase/javax.faces.resource/primefaces.js.jsf?ln=primefaces&amp;v=4.0" />
	<script>
		//<![CDATA[
		function displaySubmitLinkBox() {
			document.getElementById("registerBox").style.display = 'none';

			if (document.getElementById("submitLinkBox").style.display != 'block') {
				document.getElementById("submitLinkBox").style.display = 'block';
			} else {
				document.getElementById("submitLinkBox").style.display = 'none';
			}
		}

		function displayRegisterBox() {
			document.getElementById("submitLinkBox").style.display = 'none';

			if (document.getElementById("registerBox").style.display != 'block') {
				document.getElementById("registerBox").style.display = 'block';
			} else {
				document.getElementById("registerBox").style.display = 'none';
			}
		}

		function displayCommentBox(commentElement) {
			var thisBox = commentElement.parentElement.nextElementSibling;
			var replyBoxes = document.getElementsByClassName('replyBox');
			if (thisBox.style.display != 'block') {
				for ( var i = 0; i < replyBoxes.length; i++) {
					replyBoxes[i].style.display = 'none';
				}
				thisBox.style.display = 'block';
			} else {
				for ( var i = 0; i < replyBoxes.length; i++) {
					replyBoxes[i].style.display = 'none';
				}
				thisBox.style.display = 'none';
			}
		}
		//]]>
	</script>



</h:head>
<h:body>
	<div id="container">
		<div id="header">
			<div id="headerLogo">
				<h1>
					<a href="/WhiteIt/">whiteit</a>
				</h1>
			</div>

			<div id="headerMenu">
				<ui:insert name="headerMenu"></ui:insert>
			</div>
		</div>
		<div id="messagesBlock">
			<p:messages id="messages" autoUpdate="true" />
		</div>
		<div id="submitLinkBox">
			<ui:decorate template="subHeaderTemplate.xhtml">
				<ui:define name="subHeaderImg">
					<img src="/WhiteIt/img/cloud.png" alt="Cloud" height="80px"></img>
				</ui:define>
				<ui:define name="subHeaderDesc">
					<h1>Submit a new Link.</h1>
					<p>The students are waiting for it!</p>
				</ui:define>
				<ui:define name="subHeaderFields">
					<h:form id="newLink">
						<h:panelGrid columns="2" id="matchGrid">
							<h:outputLabel for="title" value="Title" />
							<h:inputText id="title" value="#{entryBean.linkTitle}"
								label="title" requiredMessage="true"
								styleClass="ui-inputfield ui-state-default" />
							<h:outputLabel for="url" value="URL" />
							<h:inputText id="url" value="#{entryBean.linkUrl}"
								required="true" label="title"
								styleClass="ui-inputfield ui-state-default" />
						</h:panelGrid>
						<h:commandLink id="create" value="Create"
							action="${entryBean.createLink}" styleClass="headerlinks">
							<f:param name="user" value="#{userBean.username}" />
						</h:commandLink>
					</h:form>
				</ui:define>
			</ui:decorate>
		</div>
		<div id="registerBox">
			<ui:decorate template="subHeaderTemplate.xhtml">
				<ui:define name="subHeaderImg">
					<img src="/WhiteIt/img/person.png" alt="Person" height="80px"></img>
				</ui:define>
				<ui:define name="subHeaderDesc">
					<h1>Create a new User-Account.</h1>
					<p>You only need a username and a password</p>
				</ui:define>
				<ui:define name="subHeaderFields">
					<h:form id="register">
						<h:panelGrid columns="2" id="matchGrid">
							<h:outputLabel for="username" value="Username" />
							<p:inputText id="username" value="#{userBean.username}"
								label="Username" requiredMessage="true" />
							<h:outputLabel for="password" value="Password" />
							<p:password id="password" value="#{userBean.password}"
								feedback="true" required="true" match="passwordMatch"
								label="Passwort" />
							<h:outputLabel for="passwordMatch" value="Repeat" />
							<p:password id="passwordMatch" value="#{userBean.passwordMatch}"
								required="true" label="Passwort" />
						</h:panelGrid>
						<p:commandLink id="register" value="Register"
							action="#{userBean.register}" styleClass="headerlinks" />
					</h:form>
				</ui:define>
			</ui:decorate>
		</div>

		<div id="content">
			<ui:insert name="content"></ui:insert>
		</div>
	</div>
</h:body>
</h:html>
